<!DOCTYPE html>
<html lang="zh-Hans-CN">
<head>
  <meta charset="UTF-8">
  <title>上传小票</title>
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
  <meta name="format-detection" content="telephone=no">
  <meta name="format-detection" content="email=no">
  <link rel="stylesheet" href="lib/need/layer.css"/>
  <link rel="stylesheet" href="css/style.css"/>
  <script>
    (function (size) {
      var docEl = document.documentElement,
          resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
          recalc = function() {
            docEl.style.fontSize = 20*(docEl.clientWidth/size)+'px';
          };
      window.addEventListener(resizeEvt, recalc, false);
      recalc();
    })(375);
  </script>
</head>
<body>
<section class="wapper container">
  <header class="sta-header">
    <h2>参与活动纸尿裤</h2>
    <img src="img/znk.png" alt="znk">
  </header>

  <article>
    <div class="input-group">
      <label for="stores" class="input-label">选择店面：</label>
      <input type="text" class="input-control" placeholder="选择店面" onfocus="this.blur()" readonly id="stores"/>
    </div>

    <div class="input-group">
      <label for="datetime" class="input-label">购物时间：</label>
      <input type="text" class="input-control" placeholder="选择购物时间" onfocus="this.blur()" readonly id="datetime" />
    </div>

    <div class="input-group">
      <label class="input-label input-lab">产品系列：</label>
      <ul class="input-list">
        <li>白金帮特级棉柔敏感肌</li>
        <li>
          <select name="dnum" id="dnum" class="input-control">
            <option value="">请选择</option>
            <option value="1">1</option>
            <option value="2">2</option>
          </select>
        </li>
        <li>白金帮特级棉柔拉拉裤</li>
        <li>
          <select name="cnum" id="cnum" class="input-control">
            <option value="">请选择</option>
            <option value="1">1</option>
            <option value="2">2</option>
          </select>
        </li>
      </ul>
    </div>

    <div class="input-group">
      <span class="input-label">小票上传：</span>
      <div class="addbtn-box">
        <a href="javascript:;" class="addbtn" data-img="1"></a>
        <a href="javascript:;" class="addbtn" data-img="2"></a>
        <a href="javascript:;" class="addbtn" data-img="3"></a>
      </div>
    </div>

    <div class="btn-group">
      <span class="min-load" id="load-info">请保证小票清晰可见，长小票请选择分段上传</span>
      <button class="btn btn-blod" type="button" id="sub">立即提交</button>
    </div>

  </article>
</section>

<!-- 选择卖场 -->
<div class="stores">
  <div class="stores-mask"></div>
  <div class="stores-content">
    <h2 class="st-tit text-center">选择卖场</h2>
    <ul class="st-ul">
      <li class="layer"><img class="st-img" src="img/logo_1.png" alt="logo"/><span class="st-val">沃尔玛超市</span></li>
      <li class="layer"><img class="st-img" src="img/logo_2.png" alt="logo"/><span class="st-val">奥斯卡京东方</span></li>
      <li class="layer"><img class="st-img" src="img/logo_1.png" alt="logo"/><span class="st-val">阿斯顿发撒的</span></li>
      <li class="layer"><img class="st-img" src="img/logo_2.png" alt="logo"/><span class="st-val">沃尔玛超市</span></li>
      <li class="layer"><img class="st-img" src="img/logo_1.png" alt="logo"/><span class="st-val">沃尔玛超市</span></li>
    </ul>
  </div>
</div>

<script src="lib/zepto.min.js"></script>
<script src="lib/zepto.mdater.js?1"></script>
<script src="lib/layer.js"></script>
<script src="js/main.js"></script>
<script>
  (function () {
    fn.start();
  })();
</script>
</body>
</html>
